<!DOCTYPE html>
<html>
	<head>
		<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
		<meta name="format-detection" content="telephone=no" />
		<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
		<title>指纹考勤</title>
		<link rel="stylesheet" href="//cdn.bootcss.com/weui/1.1.1/style/weui.min.css">
		<link rel="stylesheet" href="//cdn.bootcss.com/jquery-weui/1.0.1/css/jquery-weui.min.css">
		<link rel="stylesheet" href="https://unpkg.com/mint-ui/lib/style.css">
		<link rel="stylesheet" type="text/css" href="../css/kaoqin/t_check.css"/>
		<style type="text/css">
			.weui-cells{
				margin-top: 0;
			}
		</style>
	</head>
	<body>
		<div id="t_check">
			<div class="content">
				日期：<button id="Date" @click="openPicker">{{time}}</button>
				<mt-datetime-picker ref="picker" type="date" year-format="{value} 年" month-format="{value} 月" date-format="{value} 日" v-model="pickerValue" @confirm="handleConfirm">
			</mt-datetime-picker>
			</div>
			<div class="Semester">
				课程：
				<input type="text" id="Semester" v-model="Semester" readonly onfocus="this.blur();">
			</div>
			<div class="fenge"></div>
			<div class="form">
				<div class="top">
					<div class="left">
						<div class="con">
							<div class="img_con"><img src="../img/kaoqin/yindao.png"/></div>
							<div class="con_con">
								<p>应到节数</p>
								<p>{{num1}}</p>
							</div>
						</div>
					</div>
					<div class="right">
						<div class="con">
							<div class="img_con"><img src="../img/kaoqin/shidao.png"/></div>
							<div class="con_con">
								<p>实到节数</p>
								<p>{{num2}}</p>
							</div>
						</div>
					</div>
				</div>
				<div class="top">
					<div class="left">
						<div class="con">
							<div class="img_con"><img src="../img/kaoqin/kuangke.png"/></div>
							<div class="con_con">
								<p>旷课节数</p>
								<p>{{num3}}</p>
							</div>
						</div>
					</div>
					<div class="right">
						<div class="con">
							<div class="img_con"><img src="../img/kaoqin/chidao.png"/></div>
							<div class="con_con">
								<p>迟到节数</p>
								<p>{{num4}}</p>
							</div>
						</div>
					</div>
				</div>
				
			</div>
			<div class="weui-cells">
			  <a @click="Goto1()" class="weui-cell weui-cell_access" href="javascript:;">
			    <div class="weui-cell__bd">
			      <p>旷课列表</p>
			    </div>
			    <div class="weui-cell__ft">
			    </div>
			  </a>
			  <a @click="Goto2()" class="weui-cell weui-cell_access" href="javascript:;">
			    <div class="weui-cell__bd">
			      <p>迟到列表</p>
			    </div>
			    <div class="weui-cell__ft">
			    </div>
			  </a>
			</div>
		</div>
	</body>
	<script src="../js/vue.js" type="text/javascript" charset="utf-8"></script>
	<!--<script src="../js/jquery.js" type="text/javascript" charset="utf-8"></script>-->
	<script src="https://res.wx.qq.com/open/libs/weuijs/1.0.0/weui.min.js"></script>
	<script src="https://unpkg.com/mint-ui/lib/index.js"></script>
	<script type="text/javascript">
		var vm = new Vue({
			el:"#t_check",
			data:{
				time:"2016-2017第一学期",
				num1:"1234",
				num2:"1200",
				num3:"1230",
				num4:"1231",
				time:"日期选择",
				startDate: new Date('2014-1-1'),
				endDate: new Date(),
				pickerValue: "",
				Semester:"请选择",
				Number:null,
				item:""
			},
			created:function(){
				var _self = this;
			},
			watch:{
				Semester:function(){
					var _self = this;
					console.log(_self.Semester);
				},
				Number:function(New,Old){
					console.log(New)
					console.log(Old)
				}
			},
			methods:{
				handleConfirm: function(value) {
					var _self = this;
					_self.date1 = value.toString();
					var s = _self.getNowFormatDate(_self.date1);
//					console.log(_self.date1);
//					console.log(s);
					_self.time = s;
					console.log(_self.time)
				},
				handleClick: function() {
					console.log(1)
					var _self = this;
					_self.popupVisible = true;
				},
				openPicker: function() {
					this.$refs.picker.open();
					var _self = this;
					console.log(_self.pickerValue)
				},
				getNowFormatDate: function(v) {
					console.log(v)
					var date = new Date(v);
					console.log(date);
					var seperator1 = "/";
					var seperator2 = ":";
					var month = date.getMonth() + 1;
					var strDate = date.getDate();
					if(month >= 1 && month <= 9) {
						month = "0" + month;
					}
					if(strDate >= 0 && strDate <= 9) {
						strDate = "0" + strDate;
					}
					var currentdate = date.getFullYear() + seperator1 + month + seperator1 + strDate;

					console.log(currentdate);
					return currentdate;
				},
				Goto1:function(){
					var _self = this;
					var time = _self.time;
					var sum = _self.Semester;
					if(time == "日期选择" || sum == "请选择"){
						this.$toast({
						  message: '请选择',
						  position: 'middle'
						});
						return;
					}
					console.log(sum)
					localStorage.setItem("sum",sum);
					localStorage.setItem("time",time);
					location.href = "t_Absenteeism.html";
				},
				Goto2:function(){
					var _self = this;
					var time = _self.time;
					var sum = _self.Semester;
					if(time == "日期选择" || sum == "请选择"){
						this.$toast({
						  message: '请选择',
						  position: 'middle'
						});
						return;
					}
					console.log(sum)
					localStorage.setItem("sum",sum);
					localStorage.setItem("time",time);
					location.href = "t_late.html";
				}
			},
			mounted:function(){
				var _self = this;
				console.log(_self.number)
//				var sem = localStorage.getItem("sem");
//				console.log(sem);
				
			}
		})
		var Semester = document.getElementById("Semester");
				var isValu = [{
					label:"生物课",
					value:0
				},{
					label:"化学课",
					value:1
				},{
					label:"语文课",
					value:2
				}]
				Semester.addEventListener("click",function(event){
					weui.picker(isValu,{
						onChange:function(result){
							
						},
						onConfirm:function(result){
//							Semester.vlaue = isValu[parseInt(result)].label;
							vm.Semester = isValu[parseInt(result)].label;
							vm.$data.Number = result[0]
						}
					})
				},false)
	</script>
</html>
